<template>
	<view id="myGift">
		<Header txt="我的礼品" v-if="baidu"></Header>
		<HeaderB txt="我的礼品" v-if="!baidu"></HeaderB>
		<view class="bg-top">
			<view class="logo">
				<image src="https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/%E5%9B%BE%E6%A0%87/myGift-Logo.png" mode="aspectFit"></image>
			</view>
		</view>
		<uni-popup ref="popup2" type="top" background-color="#FFFFFF" class="dislog">
			<view class="pop_sign jifen_list01">
				<view class="pop_sign_tit">快递信息</view>
				<view class="you_wu clearfix" v-if="goodListImg.courier_firm != '' && goodListImg.courier_firm != null">
					<view v-if="index ==1" class="you_wu_img" :style="{ background: 'url( ' + goodListImg.goods_img + ')' }">
					</view>
					<view v-if="index !=1" class="you_wu_img" :style="{ background: 'url( ' + list[index].img + ')' }">
					</view>
					<view class="you_wu_text">
						<view class="you_text01">已发货</view>
						<view class="you_text02">{{ goodListImg.goods_name }}</view>
						<view class="you_text02">{{ goodListImg.remark }}</view>
						<view class="you_text03">
						{{ goodListImg.courier_firm }}：{{ goodListImg.courier_num }}
						</view>
					</view>
				</view>
				<view class="no_wu" v-if="goodListImg.courier_firm == '' || goodListImg.courier_firm == null">
					<view class="no_wu_tit">暂无物流信息~</view>
					<view class="no_wu_text">您的快递正在准备发货中，请耐心等待~</view>
				</view>
				<div class="close_btn">
					<image src="https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/%E5%9B%BE%E6%A0%87/myGift-close.png" mode="aspectFit" @click="close"></image>
				</div>
			</view>       
		</uni-popup>
		<view class="content">
			<view class="integral_list" v-for="(item ,index) in tableData" :key='index'>
				<view class="integral_list_left">
				    <view class="integral_list_left01"  v-if="item.goodsType == 1||item.goodsType == 2||item.goodsType == 3">积分兑换-{{ item.remark }}</view>
				    <view class="integral_list_left01"  v-if="item.goodsType == 4">积分抽奖-{{ item.remark }}</view>
				    <view class="integral_list_left02">{{ item.createTime }}</view>
				</view>
				<view class="integral_list_right" v-if="item.goodsType == 1">
					<text
					  class="integral_list_right01"
					  @click="goPage('pages/buy/buy')"
					  >去使用</text
					>
				</view>	
				<view class="integral_list_right"  v-if="item.goodsType == 2">
					<text
					  class="integral_list_right01"
					  @click="goPage2('pagesA/user/wallet')"
					  >去查看</text
					>
				</view>	
				<view class="integral_list_right"  v-if="item.goodsType == 3">
					<text
					  class="integral_list_right01"
					  @click="click(item)"
					  >查看快递</text
					>
				</view>	
				<view class="integral_list_right"  v-if="item.goodsType == 4 && (item.remark=='钱包余额5元'||item.remark=='优惠券无门槛10元')&& !(item.remark=='50积分'||item.remark=='100积分'||item.remark=='300积分')">
					<text
					   class="integral_list_right01"
					   @click="goPage2('pagesA/user/coupon')"
					   >去查看</text
					 >
				</view>	
				<view class="integral_list_right" v-if="item.goodsType == 4 && !(item.remark=='钱包余额5元'||item.remark=='优惠券无门槛10元')&&(item.remark=='50积分'||item.remark=='100积分'||item.remark=='300积分')">
					<text
					   class="integral_list_right01"
					  @click="goPage2('pagesA/active/integral')"
					  >去查看</text
					>
				</view>	
				<view class="integral_list_right" v-if="item.goodsType == 4 && item.userAddress && !(item.remark=='钱包余额5元'||item.remark=='优惠券无门槛10元'||item.remark=='50积分'||item.remark=='100积分'||item.remark=='300积分')">
					<text
					  class="integral_list_right01"
					  @click="click(item,4)"
					  >查看快递</text
					>
				</view>	
				<view class="integral_list_right" v-if="item.goodsType == 4 && !item.userAddress && !(item.remark=='钱包余额5元'||item.remark=='优惠券无门槛10元'||item.remark=='50积分'||item.remark=='100积分'||item.remark=='300积分')">
					<text
					  class="integral_list_right01 integral_list_right02"
					  @click="giftShow(item)"
					  >填写收获地址</text
					>  
				</view>		   
			</view>
		</view>
	</view>
</template>

<script>
	import {formatDate2} from "../../common/com.js"
	export default {
		data() {
			return {
				pageNum:1,
				tableData:[],
				userGoodsId: "",
				innerVisible: false,
				goodListImg:[],
				baidu:true,
				index:1,
				 addId:'',
				 list: [
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/12.png", title: "很遗憾" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/1.png", title: "50积分" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/2.png", title: "100积分" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/3.png", title: "300积分" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/4.png", title: "小夜灯" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/5.png", title: "雨伞" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/7.png", title: "停车牌" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/6.png", title: "充电宝" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/8.png", title: "鼠标垫" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/9.png", title: "钥匙扣" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/10.png", title: "钱包余额" },
				  { img: "https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/lucky/11.png", title: "熊猫优惠劵" },       
				], //奖品1-12      
			};
		},
		onReachBottom(){
			this.listUserGoods()	
		},
		onShow() {
			this.listUserGoods()
			// #ifdef MP-BAIDU
			this.baidu=false
			// #endif
			},
		methods: {
			giftShow(row){
				let that=this
				if(row.remark=="钥匙扣"){
				     that.index=9
				}else if(row.remark=="鼠标垫"){
				    that.index=8
				}else if(row.remark=="充电宝"){
				    that.index=7
				}else if(row.remark=="停车牌"){
				    that.index=6
				}else if(row.remark=="雨伞"){
				    that.index=5
				}else if(row.remark=="小夜灯"){
				    that.index=4
				}else{
				  that.index=1
				} 
				row.goodsImg=this.list[this.index].img
				console.log(row);
				let item = encodeURIComponent(JSON.stringify(row))
					uni.navigateTo({
						url: '/pagesA/active/integralDell?item=' + item
					})
			},
			click(row,num){
				let that=this
				this.userGoodsId = row.id;
				let obj = {
				        userGoodsId: this.userGoodsId,
						goodsType:3
				      };
				if(num==4){
					obj.goodsType=4
				}
				that.$store
					.dispatch("GetCourier",obj)
					.then((response) => {
						let data = response.data;
						if (data.code == "0") {
							that.goodListImg = data.obj;
							let row=data.obj
							if(row.remark=="钥匙扣"){
							     that.index=9
							}else if(row.remark=="鼠标垫"){
							    that.index=8
							}else if(row.remark=="充电宝"){
							    that.index=7
							}else if(row.remark=="停车牌"){
							    that.index=6
							}else if(row.remark=="雨伞"){
							    that.index=5
							}else if(row.remark=="小夜灯"){
							    that.index=4
							}else{
							  that.index=1
							}            
						}        
					})
				this.$refs.popup2.open('top')
			},
			close(){
				this.$refs.popup2.close('top')
			},
			goPage(e){
				uni.switchTab({
					url: `/${e}`
				})
			},
			goPage2(e){
				uni.navigateTo({
					url: `/${e}`
				})
			},
			listUserGoods(){
				let that=this
				that.$store
					.dispatch("ListUserGoods",{ pageNum: that.pageNum })
					.then((response) => {
						let data = response.data;
						if (data.code == "0") {
							let tar = data.obj.list;
							tar.forEach((item) => {
							            item.createTime = formatDate2(item.createTime,2);
							          });
							that.tableData = [...that.tableData, ...tar];
							that.pageNum++;
							if (tar.length ==7) {
								this.listUserGoods()
							}
						}        
					})
			},
		},
	}
</script>

<style lang="less">
#myGift{
	overflow: hidden;
	.bg-top{
		width: 100%;
		height: 180rpx;
		position: relative;
		background: url('https://iconimg.oss-cn-hangzhou.aliyuncs.com/%E7%86%8A%E7%8C%AB%E4%BB%A3%E7%90%86/%E5%9B%BE%E6%A0%87/myGift%E8%83%8C%E6%99%AF.png') no-repeat ;
		.logo{
			width: 150rpx;
			height: 105rpx;
			margin: 0 auto;
			padding-top: 45rpx;
			image{
				width: 100%;
				height: 100%;
			}
		}
	}
	.content{
		width: 90%;
		margin: 0 auto;
		.integral_list{
			width: 100%;
			height: 150rpx;
			border-bottom: 1px solid #e5e5e5;
			position: relative;
		}
		.integral_list_left {
			display: inline-block;
		      // float: left;
		      padding-top: 30rpx;
		      padding-bottom: 30rpx;
		    .integral_list_left01 {
		        font-size: 30rpx;
		        color: #222222;
				// font-weight: bold;
		    }
		    .integral_list_left02 {
		        font-size: 25rpx;
		        color: #b6b6b6;
		        margin-top: 20rpx;
		    }
		}
		.integral_list_right {
		  // float: right;
		  display: inline-block;
		  top: 45rpx;
		  right: 20rpx;
		  position: absolute;
		  .integral_list_right01 {
		    display: inline-block;
		    border: 1px solid #0069ff;
		    color: #0069ff;
		    width: 160rpx;
		    height: 60rpx;
		    line-height: 60rpx;
		    text-align: center;
		    border-radius: 100rpx;
		  }
		  .integral_list_right02{
			  width: 210rpx;
		  }
		}    
	}
	.dislog{
		margin-top: 50%;
	}
	.uni-popup__wrapper-box{
		height: 400rpx;
		// background:#C0C0C0;
		overflow: hidden;	
		margin-top: 50%;
		.pop_sign {
		    background-color: #FFFFFF;
			width: 90%;
			margin: 0 auto;
		    border-radius: 16rpx;
		    // padding-bottom: 40rpx;
		    overflow: hidden;
		    .pop_sign_tit {
		      width: 100%;
		      background-color: #f3f0f0;
		      height: 60rpx;
		      line-height: 60rpx;
		      color: #222222;
		      font-size: 25rpx;
		      padding-left: 20rpx;
		    }
		    .pop_sign_add {
		      font-size: 30rpx;
		      font-weight: bold;
		      margin-top: 10rpx;
		    }
		    .pop_sign_text {
		      font-size: 25rpx;
		      color: #999999;
		      margin-top: 30rpx;
		    }
			.no_wu{
				padding: 50rpx 0;
				text-align: center;
			}
			.no_wu_tit{
				font-size: 32rpx;
				color: #222222;
			}
			.no_wu_text{
				font-size: 28rpx;
				color: #999999;
				text-align: center;
				margin-top: 48rpx;				
			}
		}
		.you_wu_img{
			width: 200rpx;
			height: 180rpx;
			float: left;
			background-size: cover !important;
			background-repeat: no-repeat !important;
			background-position: center center !important;
			background-color: #eaeaea !important;
			overflow: hidden;
			margin-top: 20rpx;
			margin-bottom: 20rpx;
			margin-left: 20rpx;
			img {
				width: 100%;
			}
			 
		}
		.you_wu_text {
		  float: left;
		  margin-left:30rpx;
		  margin-top: 20rpx;
		  .you_text01 {
		    font-size: 30rpx;
		    color: #4078ef;
		    font-weight: bold;
		  }
		  .you_text02 {
		    font-size:22rpx;
		    color: #222222;
		    margin-top: 20rpx;
		  }
		  .you_text03 {
		    font-size: 22rpx;
		    color: #222222;
		    margin-top: 20rpx;
		  }
		}     
		.close_btn {
			clear: both;
			width: 100%;
			height: 100%;
		  text-align: center;
		  margin: 0 auto;
		  background:#999999;
		  border-radius: none;
		  image {
		    width: 60rpx;
			height: 60rpx;
		  }
		}  
	}
}
</style>
